<template>
  <div>
    <button type="success" @click="onChangeStore('北京')">北京</button>
    <button type="success" @click="onChangeStore('南京')">南京</button>
    <button type="success" @click="onChangeStore('武汉')">武汉</button>
    <button type="success" @click="onChangeStore('浙江')">浙江</button>
    <button type="success" @click="onChangeStore('日本')">日本</button>
    <br />
    <hr />
    <button @click="onAjax">ajax请求满足条件数据</button>
  </div>
</template>

<script>
import store from '@/store'
export default {
  name: 'CinemaView',
  data () {
    return {
      list: [
        { name: '王五', age: 18 },
        { name: '李老五', age: 43 },
        { name: '带带我', age: 54 }
      ]
    }
  },
  methods: {
    onChangeStore (payload) {
      store.commit('cinema/setName', payload)
    },
    onAjax () {
      const ret = this.list.filter((item) => item.age > 40)
      store.commit('cinema/setAjax', ret)
    }
  }
}
</script>

<style lang="scss" scoped></style>
